import React from "react";
import axios from '../../../util/http';
import * as url from '../../../util/api'
import { DatePicker,Button,Table  } from 'antd';
import './NoteRecharge.css'
const { RangePicker } = DatePicker;
export default class NoteRecharge extends React.Component {
  constructor(props) {
    super(props);
    this.state = { 
      data:[]
     };
    this.columns = [
      {
        title: '日期',
        dataIndex: 'date',
      },
      {
        title: '充值金额（元）',
        dataIndex: 'money',
      },
      {
        title: '充值条数（条）',
        dataIndex: 'num',
      },
      {
        title: '备注',
        dataIndex: 'remark',
      },
    ];
  }
  onChange(pagination, filters, sorter, extra) {
    console.log('params', pagination, filters, sorter, extra);
  }
  render() {
    let {data}=this.state
    return (
      <div>
        <div className={'duanxinHead'}>
        <RangePicker />
        <div>
          <span>可发短信条数：0条</span>
        <Button className={'button'} style={{ backgroundColor: '#4BD0B6', border: '#4BD0B6' }} type="primary">充值</Button>
        </div>
        </div>
        <div className={'duanxinTable'}>
        <Table columns={this.columns} dataSource={data} onChange={this.onChange} />
        </div>
      </div>
    );
  }
  componentDidMount() {
    axios({
      url: url.PostDxczData,
      method: 'post'
    }).then(res => {
      console.log(res.data.data)
      let data = res.data.data.filter((item) => {
        item.key = item.id
        delete item.id
        return item
      })
      this.setState({
        data:data
      })
    })
  }
}

